<template>
  <view class="order-record">
    <!-- 标题栏 -->
    <uni-section title="订单记录" type="line"></uni-section>

    <!-- 订单列表 -->
    <uni-list>
      <uni-list-item v-for="(order, index) in orderList" :key="index">
        <uni-card :title="`订单 ${index + 1}`" isShadow>
          <view class="order-item">
            <view class="item-row">
              <text class="label">订单编号</text>
              <text class="value">{{ order.orderNo }}</text>
            </view>
            <view class="item-row">
              <text class="label">下单时间</text>
              <text class="value">{{ order.orderTime }}</text>
            </view>
            <view class="item-row">
              <text class="label">状态</text>
              <text :class="order.status === '已结算' ? 'status-settled' : 'status-unsettled'">{{ order.status }}</text>
            </view>
            <view class="item-row">
              <text class="label">订单金额</text>
              <text class="value">¥{{ order.orderAmount }}</text>
            </view>
            <view class="item-row">
              <text class="label">我的收入</text>
              <text class="value">¥{{ order.myIncome }}</text>
            </view>
            <view class="item-row">
              <text class="label">商家收入</text>
              <text class="value">¥{{ order.merchantIncome }}</text>
            </view>
          </view>
        </uni-card>
      </uni-list-item>
    </uni-list>
  </view>
</template>

<script>
export default {
  data() {
    return {
      // 模拟订单数据（实际需从后端接口获取）
      orderList: [
        {
          orderNo: 'ML1526326743672426749',
          orderTime: '2025-07-20 12:00:20',
          status: '已结算',
          orderAmount: 8.00,
          myIncome: 2.00,
          merchantIncome: 6.00,
        },
        {
          orderNo: 'ML1526326743672426749',
          orderTime: '2025-07-20 12:00:20',
          status: '已结算',
          orderAmount: 8.00,
          myIncome: 2.00,
          merchantIncome: 6.00,
        },
        {
          orderNo: 'ML1526326743672426749',
          orderTime: '2025-07-20 12:00:20',
          status: '已结算',
          orderAmount: 8.00,
          myIncome: 2.00,
          merchantIncome: 6.00,
        },
      ],
    };
  },
};
</script>

<style scoped>
.order-record {
  padding: 20rpx;
}

/* 订单卡片样式 */
.uni-card {
  margin-bottom: 20rpx;
}

.order-item {
  padding: 20rpx;
}

.item-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10rpx;
}

.label {
  color: #666;
  font-size: 32rpx;
}

.value {
  color: #333;
  font-size: 32rpx;
}

.status-settled {
  color: #09bb07; /* 已结算状态绿色 */
}

.status-unsettled {
  color: #ff5722; /* 未结算状态红色（可自定义） */
}
</style>
